<div ng-init="init();" class="kmi-layout-content SMT2503-content">
    <div class="kmi-header-row">
        <div class="kmi-side-btn left" ng-click="back();">
            <i class="material-icons">&#xE408;</i>
            <div class="kmi-can-click"></div>
        </div>
        <div class="header-title" ng-bind="'SMT2503.title' | translate"></div>
        <div class="header-logo"></div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page">
            <!-- 物料編號 -->
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'SMT2503.reel_no' | translate"></label>
                <input ng-model="material_no"></input>
                <div class="tip search" ng-click="loadMaterialNo();"><img src="image/icons/search.png"></img> </div>
                <div class="kmi-button kmi-button-confrim btn-confirm" ng-click="search()"
                    style="width:100px;margin-left: 40px;">
                    <label ng-bind="'SMT2503.search' | translate"></label>
                    <div class="kmi-can-click"></div>
                </div>
            </div>
            <div class="kmi-list column-selector">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:0 0 40px">
                        <button class="mdl-button mdl-js-button mdl-button--icon" ng-click="selectAll();">
                            <img ng-if="!isSelectAll" src="image/icons/check0.png"></img>
                            <img ng-if="isSelectAll"  src="image/icons/check1.png"></img>
                        </button>
                    </div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list1.reel_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list1.material_no' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list1.qty' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list1.remain_qty' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in origin_reel_list track by $index" >
                        <div class="kmi-list__column" style="flex:0 0 40px;">
                            <button class="mdl-button mdl-js-button mdl-button--icon" ng-click="item.btn_mode = !item.btn_mode">
                                <img ng-show="!item.btn_mode" src="image/icons/check0.png"></img>
                                <img ng-show="item.btn_mode" src="image/icons/check1.png"></img>
                            </button>
                        </div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.reel_no"></div>
						<div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.material_no"></div>
						<div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.qty"></div>
                        <div class="kmi-list__column  column-border" style="flex:1;" ng-bind="item.actual_qty"></div>
                    </div>
                </div>
            </div>
            <!-- 新捲料編號 -->
            <div class="header-panel-column">
                <div class="kmi-text-fields" style="margin: 8px 0;flex: 1;">
                    <label class="label" ng-bind="'SMT2503.new_reel_no' | translate"></label>
                    <input ng-model="new_reel_no" style="margin-left: 8px;"/>
                    <div class="tip qrcode" ng-click="QRCodeScanner();">
                        <img src="image/icons/QRCode.png">
                    </div>
                </div>
                <div class="kmi-text-fields" style="margin: 8px 0;flex: 1;">
                    <label class="label" ng-bind="'SMT2503.dscpt' | translate"></label>
                    <input ng-model="combine_reason"></input>
                </div>
                <div class="kmi-button kmi-button-confrim btn-confirm" ng-click="combine()"
                    style="width:100px;margin-left: 40px;">
                    <label ng-bind="'SMT2503.combine' | translate"></label>
                    <div class="kmi-can-click"></div>
                </div>
            </div>
            
            <div class="kmi-list column-selector">
                <div class="kmi-list__header">
                    <div class="kmi-list__column" style="flex:0 0 40px;"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list2.new_reel_no' | translate"></div>
					<div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list2.new_reel_qty' | translate"></div>
					<div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list2.combine_dscpt' | translate"></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'SMT2503.list2.combine_reel_no' | translate"></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row"
                         ng-repeat="item in new_reel_list track by $index">
                         <div class="kmi-list__column column-border" style="flex:0 0 40px;">
                            <button class="mdl-button mdl-button--icon" ng-click="deleteItem(item,$index)">
                                <img src="image/icons/delete.png">
                            </button>
                        </div>
						<div class="kmi-list__column column-border" style="flex:1;" ng-bind="item.new_reel_no"></div>
						<div class="kmi-list__column column-border" style="flex:1;" ng-bind="item.new_reel_qty"></div>
                        <div class="kmi-list__column column-border" style="flex:1;" ng-bind="item.combine_reason"></div>
                        <div class="kmi-list__column column-border" style="flex:1;" ng-bind="item.combine_reel"></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- <div class="kmi-layout-footer">
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1"
                    ng-click="confirm();" ng-disabled="selectedList.length==0">
                <i class="material-icons">done</i>
            </button>
        </div> -->
    </div>
</div>
